<template>
  <div @click="clickHidePictures"  :style="{height:windowHeight+'px'}" style="width:3.75rem;position:fixed;left:0;top:0;background-color:rgba(0,0,0,1)" >
    <swiper v-if='pictures.length>0' :options="swiperOption" ref="mySwiper" :style="{height:windowHeight+'px'}" style="width:3.75rem;">
      <swiper-slide  v-for="(item,index) in pictures" :key="index" id="index">
        <img :style="{height:windowHeight+'px'}" style="width:3.75rem;object-fit:contain;" :src="item.picture_url"></img>
      </swiper-slide>
      <div class="swiper-pagination" slot="pagination"></div>
    </swiper>
  </div>

</template>
<script>
  import utils from '../utils'
  import httputil from '../httputil'
  import 'swiper/dist/css/swiper.css'
  import { swiper, swiperSlide } from 'vue-awesome-swiper'
  var vm = null;
  export default {
    props: ['id'],
    data() {
      return {
        pictures:[],
        windowHeight:667,
        swiperOption: {
          pagination: {
            el: '.swiper-pagination',
            bulletClass : 'swiper-dot',
            bulletActiveClass: 'swiper-dot-active',
          },
          loop: true,
//          direction:'vertical',
//          autoplay:{   delay: 3000,
//            stopOnLastSlide: false,
//            disableOnInteraction: false },
          on:{
            click: function(e){
//              debugger
//              vm.clickHidePictures()
            },
          },
        }
      }
    },
    components: {
      swiper,
      swiperSlide
    },
    computed: {
      swiper() {
        return this.$refs.mySwiper.swiper
      }
    },
    created() {
      vm = this
      this.windowHeight  = window.innerHeight
      this.getPicturesList()
    },

    methods: {
      getPicturesList() {
        var that = this
        var params = {id: this.id}
        httputil.request("discount/pictures", params, function (successresult) {
          if (successresult.pictures != null) {
            that.pictures = successresult.pictures
          }

        }, function (errorresult) {

        }, "GET", true)
      },
      clickHidePictures(){
        if (window.location.href.indexOf("#viewpictures") != -1) {
          window.history.back()
        }
      },
    }
  }

</script>
<style>

</style>
